 <%@ page language="java" pageEncoding="UTF-8"
	errorPage="/ui/defaultException.jsp"%>
		<div class="hotel-slider">
			<div class="slider-wrapper theme-default">
				<div id="slider" class="nivoSlider">
					<c:forEach var="bigImage" items="${bigImages }" varStatus="status">
						<a href="${bigImage.linkUrl }"> <img
							src="${image_domain }${bigImage.origImage }"
							data-thumb="${image_domain }${bigImage.origImage }"
							title="#htmlcaption${status.index }"
							alt="${bigImage.imageTitle }" /> </a>
					</c:forEach>
				</div>
				<c:forEach var="bigImage" items="${bigImages }" varStatus="status">
					<div id="htmlcaption${status.index }" class="nivo-html-caption">

						<div class="big-title">
							<a href="${bigImage.linkUrl }" title="${bigImage.imageTitle }">${bigImage.imageTitle
								}</a>
						</div>
						<div class="small-title">
							<a href="${bigImage.linkUrl }" title="${bigImage.imageDesc }">${bigImage.imageDesc
								}</a>
						</div>
					</div>
				</c:forEach>
			</div>
		</div>
		<style>
.nivoSlider {
	height: 500px;
}
.nivo-caption {
	height: 80px;
	text-align: center;
	color: #FFF;
	-moz-opacity: 0.5;
	filter: alpha(opacity = 5);
	opacity: 0.5;
	filter: progid : DXImageTransform.Microsoft.Alpha ( opacity = 50 );
	*filter: alpha(opacity = 70);
}

.nivo-caption .big-title {
	padding: 0;
	text-align: center;
	height: 50px;
	font-weight: normal;
	font-size: 24px;
	font-family: "微软雅黑", Arial;
	line-height: 40px;
	overflow: hidden;
}
.theme-default .nivo-caption a {border-bottom:none;}
.nivo-caption .small-title {
	height: 30px;
	margin-top: 0px;
	text-align: center;
	line-height: 18px;
	font-size: 12px;
	font-family: "宋体", Arial;
	font-weight: normal;
}
</style>
		<script type="text/javascript">
			$(window).load(function() {
				$('#slider').nivoSlider({
					directionNav : true,
					controlNav : false,
					pauseTime : 4000
				});
			});
		</script>